<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="../taglibs.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>修改用户</title>
<link rel="stylesheet" type="text/css" href="${path}/static/common/bootstrap-3.3.7-dist/css/bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="${path}/static/common/layui/css/layui.css"/>
<link rel="stylesheet" type="text/css"
	href="${path}/static/front/css/reset.css">
<link rel="stylesheet" type="text/css"
	href="${path}/static/front/css/main.css">
</head>
<body>
	<p style="text-align:center;font-family:'楷体';font-size :20px;">订单详情</p>
	<div class="right_content clearfix">
			<ul class="order_list_th w978 clearfix">
				<li class="col01">${order.updateTime }</li>
				<li class="col02">订单号：${order.orderNo}</li>
				<li class="col02 stress">
					<c:choose>
						<c:when test="${order.status eq 0 }">
						       已取消
						</c:when>
						<c:when test="${order.status eq 10 }">
						       未付款
						</c:when>
						<c:when test="${order.status eq 20 }">
						       已付款
						</c:when>
						<c:when test="${order.status eq 40 }">
						       已发货
						</c:when>
						<c:when test="${order.status eq 50 }">
						       交易成功
						</c:when>
						<c:when test="${order.status eq 60 }">
						       交易关闭
						</c:when>
						<c:otherwise>
						   状态异常
						</c:otherwise>
					</c:choose>
				</li>
			</ul>
			<table class="order_list_table w980">
				<tbody>
					<tr>
						<td width="55%">
							<c:forEach items="${order.orderItemList }" var = "orderItem">
							<ul class="order_goods_list clearfix">
								<li class="col01"><img src="${orderItem.productImageFullUrl}"></li>
								<li class="col02">${orderItem.productName }<em>${orderItem.currentUnitPrice }元</em></li>
								<li class="col03">${orderItem.quantity }</li>
								<li class="col04">${orderItem.totalPrice}元</li>
							</ul>
							</c:forEach>
							
						</td>

						<td width="15%">${order.receiverName }</td>
						<td width="15%">
							<c:choose>
								<c:when test="${order.status eq 0 }">
								       已取消
								</c:when>
								<c:when test="${order.status eq 10 }">
								       未付款
								</c:when>
								<c:when test="${order.status eq 20 }">
								       已付款
								</c:when>
								<c:when test="${order.status eq 40 }">
								       已发货
								</c:when>
								<c:when test="${order.status eq 50 }">
								       交易成功
								</c:when>
								<c:when test="${order.status eq 60 }">
								       交易关闭
								</c:when>
								<c:otherwise>
								   状态异常
								</c:otherwise>
							</c:choose>
						</td>
						<td width="15%"><a href="#" class="oper_btn">查看物流</a></td>
					</tr>
				</tbody>
			</table>
		</div>
	
		<hr>
		<br>
	
		<div style = "font-size :15px">
			收件人姓名：${shipping.receiverName }
			收件人移动电话：${shipping.receiverPhone }
			收件人固定电话：${shipping.receiverMobile }
		</div>
		<table class="layui-table" lay-even="" lay-skin="row">
		  <colgroup>
		    <col width="140">
		    <col width="140">
		    <col width="140">
		    <col>
		  </colgroup>
		  <thead>
		    <tr>
		      <th>收件人姓名</th>
		      <th>收件人移动电话</th>
		      <th>收件人固定电话</th>
		    </tr> 
		  </thead>
		  <tbody>
		    <tr>
		      <td>${shipping.receiverName }</td>
		      <td>${shipping.receiverPhone }</td>
		      <td>${shipping.receiverMobile } </td>
		    </tr>
		  </tbody>
		</table>  
		
		<table class="layui-table" lay-even="" lay-skin="row">
		  <colgroup>
		    <col width="140">
		    <col width="140">
		    <col width="140">
		    <col>
		  </colgroup>
		  <thead>
		    <tr>
		      <th>省</th>
		      <th>市</th>
		      <th>县</th>
		      <th>详细地址</th>
		      <th>邮编</th>
		    </tr> 
		  </thead>
		  <tbody>
		    <tr>
		      <td>${shipping.receiverProvince }</td>
		      <td>${shipping.receiverCity }</td>
		      <td>${shipping.receiverDistrict } </td>
		      <td>${shipping.receiverAddress }</td>
		      <td>${shipping.receiverZip }</td>
		    </tr>
		   	
		  </tbody>
		</table>  
		
		
		
		
		
   <button class="layui-btn" onclick="submitForm()" style="display:block;margin:0 auto">确定</button>
   
   
   <script src="${path}/static/common/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
   <script src="${path}/static/common/layer/layer.js" type="text/javascript" charset="utf-8"></script>
   <script src="${path}/static/common/mylayer.js" type="text/javascript" charset="utf-8"></script>
   <script src="${path}/static/common/layui/layui.js" type="text/javascript" charset="utf-8"></script>
   <script src="${path}/static/common/kindeditor/kindeditor.js" type="text/javascript" charset="utf-8"></script>
   <script src="${path}/static/common/kindeditor/lang/zh_CN.js" type="text/javascript" charset="utf-8"></script>
   
   <script type="text/javascript">
   	   layui.use(["form", "upload"], function() {
   			var form = layui.form;
   			var upload = layui.upload;
   			
   		    //普通图片上传
	   		var uploadInst = upload.render({
	   		    elem: '#uploadBtnId'
	   		    ,url: '${path}/upload/uploadImg.action' //改成您自己的上传接口
	   		    ,before: function(obj){// 这个预览是在前台，和后台没有关系
	   		      //预读本地文件示例，不支持ie8
	   		      obj.preview(function(index, file, result){
	   		        $('#mainImageId').attr('src', result); //图片链接（base64）
	   		      });
	   		    }
	   		    ,done: function(result){
	   		       if(result.success) {
	   		    	   // result.data返回的是图片的名字
	   		    	   $("#mainImageInputId").val(result.data);
	   		       }
	   		    }
	   		    ,error: function(){
	   		      //演示失败状态，并实现重传
	   		      var demoText = $('#demoText');
	   		      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
	   		      demoText.find('.demo-reload').on('click', function(){
	   		        uploadInst.upload();
	   		      });
	   		    }
	   		});
   			
   			form.on("select(topCategoryFilter)", function(data) {
   				// data代表当前选中的option标签对象(js dom)
   				console.log(data.value);// 被选中的option的value值
   				// 根据一级分类去加载二级二类
   				$.post(
   					"${path}/category/selectSecondCategoryByTopCategoryId.action",
   					{"topCategoryId" : data.value},
   					function(result) {
   						console.log(result);
   						$("#secondCategoryId").empty();
   						// result.data  List<Category> secondCategoryList;
   						$("#secondCategoryId").append("<option value=''>请选择二级分类</option>");
   						$(result.data).each(function() {
   							// this代表当前正在遍历的Category对象
   							var html = "<option value='"+this.id+"'>"+this.name+"</option>";
   							$("#secondCategoryId").append(html);
   						});
   						// 刷新select标签，重新渲染
   						form.render("select");
   					},
   					"json"
   				);
   			});
   			
   			
   			
   	   });
   
	   function submitForm() {
		   var index = parent.layer.getFrameIndex(window.name);
		   setTimeout(function() {
				 // 关闭弹出层
				 parent.layer.close(index); 
				 // 刷新父页面
				 window.parent.location.reload();
			}, 0);
		}
	   
	   KindEditor.ready(function(K) {
		    var kingEditorParams = {
		         afterBlur: function () { this.sync(); }
		    }
		    KindEditor.create('#editor_id', kingEditorParams);
		});
	</script>
</body>
</html>